<div class="width-100">
    <es-header [title]="'审批管理'" [class]="'approval'"></es-header>
</div>
<div class="page-background">
    <div class="page-container">
        <div class="width-100 approve-buttons">
            <div class="left">
                当前已经选择 {{nowCheckList.length}} 项
            </div>
            <div class="right">
                <div class="icon1" (click)="approve(true, nowCheckList, 1)">审批通过</div>
                <div class="icon2" (click)="approve(false, nowCheckList)">拒绝通过</div>
                <div class="icon3" (click)="approve(true, nowCheckList, 1)">批量审批通过</div>
                <div class="icon4" (click)="approve(false, nowCheckList)">批量拒绝通过</div>
            </div>
            <div class="clearfix"></div>
        </div>
        <div id="pdf">
            <es-table [headers]="headers" (sortEvent)="sortEvent($event)" (checkEvent)="checkChange($event)" [checkBox]="true" [datas]="datas"
                #table>
                <ng-template let-data>
                    <es-table-column [header]="data.h" [data]="data.d" [field]="'id'">
                        {{data.d.id}}
                    </es-table-column>
                    <es-table-column [header]="data.h" [data]="data.d" [field]="'approvaler'">
                        <div>{{data.d.approvaler}}</div>
                    </es-table-column>
                    <es-table-column [header]="data.h" [data]="data.d" [field]="'config'">
                        <div>{{data.d.config}}</div>
                    </es-table-column>
                    <es-table-column [header]="data.h" [data]="data.d" [field]="'network'">
                        <div>{{data.d.network}}</div>
                    </es-table-column>
                    <es-table-column [header]="data.h" [data]="data.d" [field]="'os'">
                        <div>{{data.d.os}}</div>
                    </es-table-column>
                    <es-table-column [header]="data.h" [data]="data.d" [field]="'comment'">
                        <div>{{data.d.comment}}</div>
                    </es-table-column>
                    <!-- <es-table-column [header]="data.h" [data]="data.d" [field]="'button'" id="{{'buttonContainer'+ data.d.id}}">
                        <div class="cursor-pointer check-button" (click)="batchOps(data.d)">b</div>
                        <div *ngIf="data.d.showSubContainer" class='sub-container diplay-flex flex-direction-column'>
                            <div class="width-100">
                                当前已经选择{{nowCheckList.length}}项
                            </div>
                            <div class="width-100 diplay-flex flex-direction-column">
                                <div class="sub-title" (click)='just(data.d)'>审批通过</div>
                                <div class="sub-title" (click)='just(data.d)'>拒绝通过</div>
                                <div class="sub-title" (click)='just(data.d)'>批量审批通过</div>
                                <div class="sub-title" (click)='just(data.d)'>批量拒绝通过</div>
                            </div>
                        </div>
                    </es-table-column> -->
                </ng-template>
            </es-table>
        </div>
        <div class="pagination">
            <pagination [total]='totalCount' [(nowPage)]="nowPage" [pageSize]='pageSize' (paginationEvent)="paginationChange()"></pagination>
        </div>
    </div>
</div>
<clr-modal [(clrModalOpen)]="basic" [clrModalSize]="'sm'" [clrModalClosable]="true">
    <h3 class="modal-title">审批结果</h3>
    <div class="modal-body">
        <p>{{modalInfo}}</p>
    </div>
</clr-modal>